<script setup lang="ts">
// 普通搜索
import type { ListProp } from "../index.vue";

const emit = defineEmits(["search"]);
defineProps(["keyword", "list"]);

const handleSeachItem = (item: ListProp) => {
  emit("search", item);
};
</script>

<template>
  <section>
    <h3 class="h-12 ml-2.5 pr-2.5 text-base leading-[96px] text-blue-500">
      搜索"{{ keyword }}"
    </h3>
    <ul class="list">
      <li
        class="flex items-center h-11.5 pl-2.5"
        v-for="(item, index) in list"
        :key="'recom' + index"
        @click="handleSeachItem(item)"
      >
        <SvgIcon icon="search" className="mr-1.5"></SvgIcon>
        <span
          class="
            flex-1
            inline-block
            overflow-hidden
            leading-[88px]
            text-slate-500
            border-b-2 border-slate-100
            line-clamp-1
          "
          >{{ item.first }}</span
        >
      </li>
    </ul>
  </section>
</template>

<style lang="scss" scoped></style>
